<template>
	<view class="like">
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">我的{{barTitleText}}</block>
		</cu-custom>
		<Loading :loadModal="loadModal" :hint="hint"></Loading>
		<scroll-view scroll-x class="bg-white nav">
			<view class='flex text-center'>
				<block v-for="(item,idx) in navItems" :key="idx">
					<view class="cu-item flex-sub" :class="item.index==tabCur?'text-orange cur':''" @tap='tabSelect'
						:data-id="item.index">
						{{item.name}}
					</view>
				</block>
			</view>
		</scroll-view>

		<!--文章列表-->
		<view class="cu-card article no-card">
			<view v-for="(item,idx) in postRelated" :key="idx" :data-idx="idx" :id="item.postId" @tap="bindPostDetail"
				class="cu-item shadow solids-bottom">
				<view class="title text-cut ">{{item.postTitle}}</view>
				<view class="content">
					<image :src="item.postUrl" mode="aspectFill"></image>
					<view class="desc">
						<view class='text-content '>{{item.postDigest}}</view>
						<view class='text-gray text-sm text-right'>
							{{barTitleText}}时间： {{item.createTime}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<Nodata :noModal="nodata"></Nodata>
	</view>
</template>

<script>
	import Loading from '../../components/loading.vue';
	import Nodata from '../../components/nodata.vue';
	import api from '../../utils/api.js';
	import util from '../../utils/util.js';
	export default {
		components: {
			Loading,
			Nodata
		},
		data() {
			return {
				imgUrl: getApp().globalData.imgUrl,
				loadModal: false, //加载
				nodata: false,
				nomore: false,
				hint: '加载中...',
				navItems: [{
					name: '我的收藏',
					index: 1
				}, {
					name: '我的点赞',
					index: 2
				}],
				tabCur: 1,
				scrollLeft: 0,
				page: 1,
				barTitleText: "",
				postRelated: [],
				user_id: null
			}
		},

		onLoad: async function(options) {
			this.tabCur = options.type;
			this.barTitleText = options.type == "1" ? "收藏" : "点赞";
			let userInfo = getApp().globalData.userInfo;
			if (Object.keys(userInfo).length > 0) {
				this.user_id = userInfo.user_id;

				await this.getPostRelated(parseInt(options.type))
			} else {
				uni.navigateTo({
					url: '../login/login',
				})
			}
		},
		methods: {
			/**
			 * 获取收藏或喜欢列表
			 */
			getPostRelated: async function(type) {
				let that = this;
				let page = that.page;
				let where = {
					type: type,
					openId: this.user_id
				};
				this.loadModal = true;
				this.nodata = false;
				this.nomore = false;
				let postRelated = await api.getPostRelated(where, page)
				this.loadModal = false;
				uni.stopPullDownRefresh();
				if (postRelated.data.length === 0) {
					uni.showToast({
						title: '没有更多数据了！',
						icon: 'none',
						duration: 2000
					})
					that.nomore = true
					if (page === 1) {
						that.nodata = true;
					}
				} else {
					that.postRelated = that.page == 1 ? postRelated.data : [...that.postRelated, ...postRelated.data];
				}
			},
			bindPostDetail(e) {
				wx.vibrateShort({})
				let id = e.currentTarget.dataset.id;
				wx.navigateTo({
					url: '../detail/detail?id=' + id,
				})
			},
			/**
			 * tab切换
			 * @param {} e 
			 */
			tabSelect: async function(e) {
				let that = this;
				that.tabCur = e.currentTarget.dataset.id;
				that.barTitleText = e.currentTarget.dataset.id === "1" ? "收藏时间：" : "点赞时间：";
				that.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
				that.postRelated = [];
				that.nodata = false;
				that.page = 1;

				await that.getPostRelated(e.currentTarget.dataset.id)
			},
		},
		onPullDownRefresh() { //下拉刷新
			this.hint = '刷新中...';
			this.pageInex = 1;
			this.getPostRelated(this.tabCur);
		},
		onReachBottom() { //上拉加载
			this.hint = '加载中...';
			this.pageInex = this.pageInex + 1;
			this.getPostRelated(this.tabCur);
		}
	}
</script>

<style>

</style>
